import React ,{Component} from "react"
import Video from "react-native-video"
import VideoScreen from "../../components/VideoScreen"
import {View, Text, StyleSheet,ScrollView} from "react-native"
import {connect} from "react-redux";


import ScrollableTabView, {DefaultTabBar, ScrollableTabBar} from 'react-native-scrollable-tab-view';
class CommonProblem extends Component{
    constructor(props) {
        super(props);
        this.state = {
            tabNames: ['主页', '分类', '她他群','我的'],
            tabIconNames: ['ios-home', 'ios-grid',  'logo-buffer', 'ios-contact'],

        };

    }


    render(): React.ReactNode {
        let tabNames = this.state.tabNames;
        let tabIconNames = this.state.tabIconNames;
        return <View style={styles.container}>


             <VideoScreen/>
        </View>


    }
}


class MyTab extends React.Component{
    render(): React.ReactNode {
        return <ScrollableTabView
            renderTabBar={() => <ScrollableTabBar />}>

            <ScrollView tabLabel='iOS'>
                <Text >iOS Tab </Text>
            </ScrollView>
            <ScrollView tabLabel='Android'>
                <Text >Android Tab </Text>
            </ScrollView>
        </ScrollableTabView>
    }

}

const styles = StyleSheet.create({
   container: {
       marginTop:100,
       backgroundColor:"#999",
       height:400
   },
    tabWarp:{
        flexDirection:"row"
    },
    tab:{
       flex:1
    },
    tabText:{
       textAlign:"center"
    },
    backgroundVideo: {
        position: 'absolute',
        top: 0,
        left: 0,
        bottom: 0,
        right: 0,
        borderWidth:1,
        borderColor:"#999",
        height:200,
        width:200
    },

});


export default connect(
    (state) => {
        return {
        }
    },
    (dispatch) => ({

    })
)(CommonProblem)